<!DOCTYPE html>
<html>

<head>
    <meta charset="UTF-8">
    <title>世界疫情可视化</title>
    <link rel="stylesheet" href="../static/css/world.css">
</head>
<body>
    <div class="wrapper">
        <div id="web_bg" style="background-image: url(../static/img/bg.jpg);"></div>
    </div>

    <div style="top:3%;left:18.5%;position: absolute;color:chocolate;">
        <img src="../static/img/title-left.png">
    </div>
    <div style="top:3%;left:58.5%;position: absolute;color:chocolate;">
        <img src="../static/img/title-right.png">
    </div>
    <div style="top:0;left:39.5%;position: absolute;color:chocolate;">
        <h1>世界疫情状况可视化</h1>
    </div>
    <div style="position:absolute;bottom:88%;left:1%;width:75%">
        <div id="currentConfirmedCount"  style="top:17%;left:30%;position: absolute;color:#FF0000;font-family:'LcdD'"></div>
        <div id="confirmedCount" style="top:17%;left:50%;position: absolute;color:#FF0000;font-family:'LcdD'"></div>
        <div id="deadCount" style="top:17%;left:72%;position: absolute;color:#FF0000;font-family:'LcdD'"></div>
        <div id="deathRate" style="top:17%;left:90%;position: absolute;color:#FF0000;font-family:'LcdD'"></div>
    </div>
    <div id="left"></div>
    <div id="right1"></div>
    <div id="right2"></div>
    <div style="position:absolute;bottom:85%;left:10.5%;width:75%">
        <div style="top:21%;left:20%;position: absolute;color: aqua;">
                    <h3>现存确诊</h3>
            </div>
            <div style="top:21%;left:41%;position: absolute;color: aqua;">
                <h3>累计确诊</h3>
            </div>
            <div style="top:21%;left:62%;position: absolute;color: aqua;">
                <h3>累计死亡</h3>
            </div>
            <div style="top:21%;left:79%;position: absolute;color: aqua;">
                <h3>病死率</h3>
            </div>
    </div>
    <div style="position:absolute; top:20%; left:23%; color:#6fbde1; font-size:18.5px">
        <p>各国累计确诊可视化</p>
    </div>
	<!--导入jquery，echarts-->
	<script src="../static/js/jquery-2.1.4.min.js"></script>
    <script src="../static/js/echarts.min.js"></script>
    <!--导入主题-->
    <script src="../static/js/macarons.js"></script>
    <!--导入绘制地图依赖-->
    <script src="../static/js/echarts-wordcloud.min.js"></script>
    <script src="../static/js/echarts-gl.min.js"></script>
    <script src="../static/js/china.js"></script>
    <script src="../static/js/world.js"></script>
    <!--导入自己的脚本-->
    <script src="../static/js/worldCov.js"></script>
</body>
</html>